<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,height=device-height, user-scalable=no,initial-scale=1, minimum-scale=1, maximum-scale=1">
    <title>商品详情</title>
    <script type="text/javascript" src="/store/js/jquery-1.12.1.min.js"></script>
    <link rel="stylesheet" href="css/spxq.css"/>
    <link rel="stylesheet" type="text/css" href="css/swipe.css">
   	<script type="text/javascript" src="js/touch.js"></script>
    <script src="/js/plugins/jrender/jrender.min.js"></script>
    <script src="/js/common.js"></script>
    <script>
        $(function () {
            var params=getParams();
            $.get("/article/"+params.articleId,function (data) {
                $(".body").renderValues(data,{
                    getHref:function (item,value) {
                        var href = $(item).data("href");
                        $(item).attr("href",href+value);
                    }
                })
                console.log(data);
            });

        })
    </script>
</head>
<body>
<div class="body">
    <div class="tour">
        <a href="javascript:history.go(-1);" class="tour1"><img src="img/back.png" alt="" style="height: 26px;width: 20px"></a>
        <p>商品详情</p>
        <a href="myList.html" class="tour2"><img src="img/u65.png" alt="" style="width: 35px;height: 35px"></a>
    </div>
    <figure>
        <div class="addWrap">
            <div class="swipe" id="mySwipe">
               <!--展示商品3张图片-->
                <div class="swipe-wrap">
                    <div><a href="javascript:;"><img class="img-responsive" render-src="picUrl"/></a></div>
                    <div><a href="javascript:;"><img class="img-responsive" render-src="picUrlT"/></a></div>
                    <div><a href="javascript:;"><img class="img-responsive" render-src="picUrlTH"/></a></div>
                </div>
            </div>
            <ul id="position">
                <li class="cur"></li>
                <li class=""></li>
                <li class=""></li>
            </ul>
        </div>
        <!-- 轮播 -->
        <script src="js/swipe.js"></script>
        <script type="text/javascript">
            var bullets = document.getElementById('position').getElementsByTagName('li');
            var banner = Swipe(document.getElementById('mySwipe'), {
                auto: 3000,
                continuous: true,
                disableScroll:false,
                callback: function(pos) {
                    var i = bullets.length;
                    while (i--) {
                        bullets[i].className = ' ';
                    }
                    bullets[pos].className = 'cur';
                }
            });
        </script>

        <!--商品详情-->
        <p render-html="articleName"></p>
        <div class="info">
            <em class="sat">￥<i render-html="price"></i></em>
            <a data-href="shopping.html?articleId=" render-key="id" render-fun="getHref"><button type="button" class="btn">加入购物车</button></a>
        </div>
    </figure>
    <hr/>
    <div class="sjxx">
        <p class="pclass1">商品描述:<i render-html="content"></i></p>
    </div>
    <hr/>
    <div class="sjxx">
        <p class="pclass2">商家</p>
        <p class="pclass2">名称：<i render-html="supplierName"></i></p>
        <p class="pclass2">地址：<i render-html="supplierAddress"></i></p>
        <p class="pclass2">电话：<i render-html="supplierPhone"></i></p>
    </div>
     <div class="zshlogo"></div>
    <div class="wx_nav" id="wx_nav">
        <a href="javascript:;" class="nav_index" id="nav_index">首页</a>
        <a href="shopping.html" class="nav_shopcart" id="nav_shopcart">购物车</a>
        <!--<a href="javascript:;" class="nav_me on" id="nav_me on">订单</a>-->
    </div>
    </div>
</body>
</html>